<template>
	<view class="container">
		<view class="container1">
			<Default
				:showflag="showflag"
				:type='4'
			></Default>
			<view class="list" v-for="(item, index) in messageList" @click="goOrderDetail(item.order_id)">
				<view class="time">{{ timeStr(item.created_at) }}</view>
				<view class="content">
					<view class="title">{{ item.title }}<view v-if="!item.is_read"></view></view>
					<view class="message">
						{{  item.content }}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data() {
			return{
				showflag: false,
				messageList: [], // 信息数据
			}
		},
		onShow() {
			this.getMssage()
		},
		methods: {
			//  获取消息数据
			getMssage() {
				let that = this
				that.$mrequest({
					url: 'Mini/notice/getNoticeList',
					method: 'POST',
					callBack: function callBack (res) {
						console.log('消息通知请求成功', res)
						if (res.status) {
							that.messageList = res.data
							console.log('打印通知消息', that.messageList)
							if (that.messageList.length > 0) {
								that.showflag = false
							} else {
								that.showflag = true
							}
						}
					},
					fail: function fail (res) {
						console.log('消息通知请求报错', res)
					}
				})
			},
			//  时间戳转化
			timeStr(str) {
				let timeStr = ''
				let timer = new Date(str)
				let year = timer.getFullYear()
				let month = timer.getMonth() + 1 < 10 ? '0' + timer.getMonth() + 1 : timer.getMonth() + 1
				let day = timer.getDate() < 10 ? '0' + timer.getDate() : timer.getDate()
				let hour = timer.getHours() < 10 ? '0' + timer.getHours() : timer.getHours()
				let mins = timer.getMinutes() < 10 ? '0' + timer.getMinutes() : timer.getMinutes()
				let sec = timer.getSeconds() < 10 ? '0' + timer.getSeconds() : timer.getSeconds()
				timeStr = year + '-' + month +  '-' + day + ' ' +  hour + ':' +  mins + ':' + sec
				// console.log(timeStr)
				return timeStr
			},
			// 跳转订单详情
			goOrderDetail(id) {
				uni.navigateTo({
					url: '../../order/orderDetail/index?order_id=' + id
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		position: relative;
		background: rgba(239, 240, 247, 1);
		padding: 0 30rpx;
		box-sizing: border-box;
	}
	.container1{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		padding: 0 30rpx 30rpx;
		box-sizing: border-box;
		background: rgba(239, 240, 247, 1);
	}
	.list{
		overflow: hidden;
		.time{
			margin: 36rpx 0;
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #99A2A9;
			text-align: center;
		}
		.content{
			width: 100%;
			background-color: #fff;
			padding: 36rpx;
			box-sizing: border;
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #99A2A9;
			line-height: 60rpx;
			border-radius: 5rpx;
			.title{
				position: relative;
				display: inline-block;
				font-size: 36rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #333333;
				&>view{
					position: absolute;
					top: 10rpx;
					right: -20rpx;
					height: 13rpx;
					width: 13rpx;
					border-radius: 50%;
					background: rgba(244, 67, 54, 1);
				}
			}
		}
	}
</style>
